﻿@using PagedList.Mvc
@using VietTrips.Domain.Helpers
@using VietTrips.WebUI.Helpers

@model PagedList.IPagedList<VietTrips.Domain.Models.UserProfile>
@* Model của page này là 1 object kiểu IPagedList<UserProfile> nó giống như List nhưng hỗ trợ Paging *@

@{
    var currentUsername = User != null ? User.Identity.Name : "unknown";
    int pageNumber = PageNumberHelper.ConvertObjectToInt(ViewBag.Page, 1); // store page number
    int rowsNumber = PageNumberHelper.ConvertObjectToInt(ViewBag.RowsPerPage, 10); // store page size => "maximum records per page"
    int totalUsers = PageNumberHelper.ConvertObjectToInt(ViewBag.UsersCount, 0); // store number of total records
    int rowCount = Model.Count();                                               // store number of records that will be shown
    var roleComparator = new RoleComparator();                                  // Comparator to compare Role
    NavCurrentHelper.Menu = 2;                                                  // Store the navigation side bar state
    NavCurrentHelper.Submenu = 1;                                               // Store the navigation side bar state
    ViewBag.Title = "Danh Sách Tài Khoản";
    Layout = "~/Areas/Management/Views/Shared/_AdminLayout.cshtml";
}

@section styles {
    <!-- BEGIN PAGE LEVEL STYLES -->
    <link rel="stylesheet" type="text/css" href="~/Content/metronic/plugins/select2/select2.css" />
    <link rel="stylesheet" type="text/css" href="~/Content/metronic/plugins/select2/select2-metronic.css" />
    <link rel="stylesheet" href="~/Content/metronic/plugins/data-tables/DT_bootstrap.css" />
    <!-- END PAGE LEVEL STYLES -->
}

@section featured {
    <!-- BEGIN PAGE HEADER-->
    <div class="row">
        <div class="col-md-12">
            <!-- BEGIN PAGE TITLE & BREADCRUMB-->
            <h3 class="page-title">
                @ViewBag.Title
            </h3>
            <ul class="page-breadcrumb breadcrumb">
                <li>
                    <i class="fa fa-home"></i>
                    <a href="@Url.Action("Dashboard", "Admin")">
                        Trang Quản Lý
                    </a>
                    <i class="fa fa-angle-right"></i>
                </li>
                <li>
                    <a href="#">
                        @ViewBag.Title
                    </a>
                </li>
                <li class="pull-right">
                    <div id="dashboard-report-range" class="dashboard-date-range tooltips" data-placement="top" data-original-title="Change dashboard date range">
                        <i class="fa fa-calendar"></i>
                        <span>
                        </span>
                        <i class="fa fa-angle-down"></i>
                    </div>
                </li>
            </ul>
            <!-- END PAGE TITLE & BREADCRUMB-->
        </div>
    </div>
}

<div class="row">
    <div class="col-md-12">
        <!-- BEGIN TABLE PORTLET-->
        <div class="portlet">
            @*<div class="portlet-title">
                    <div class="caption">
                        Danh sách các tài khoản đã đăng ký
                    </div>
                    <div class="tools">
                        <a href="javascript:;" class="reload">
                        </a>
                    </div>
                </div>*@
            <div class="portlet-body mt-20">
                <div class="row">
                    <div class="col-md-12 col-sm-12">
                        <div class="btn-group pull-left">
                            <label style="font-size: 13px; margin-top: 8px;">
                                <a href="@Url.Action("UsersList", "UserManager", new {page = 1, rowsPerPage = rowsNumber})" @if (string.IsNullOrEmpty(ViewBag.CurrentRole)) { <text> class="text-danger" </text>   }>
                                    Tất Cả
                                </a> |
                                <a href="@Url.Action("UsersList", "UserManager", new {page = 1, rowsPerPage = rowsNumber, role = "User"})" @if (ViewBag.CurrentRole == "User") { <text> class="text-danger" </text>    }>
                                    Du Khách
                                </a> |
                                <a href="@Url.Action("UsersList", "UserManager", new {page = 1, rowsPerPage = rowsNumber, role = "Agency"})" @if (ViewBag.CurrentRole == "Agency") { <text> class="text-danger" </text>    }>
                                    Quản Lý Công Ty
                                </a> |
                                <a href="@Url.Action("UsersList", "UserManager", new {page = 1, rowsPerPage = rowsNumber, role = "Administrator"})" @if (ViewBag.CurrentRole == "Administrator") { <text> class="text-danger" </text>     }>
                                    Quản Trị Viên
                                </a>
                            </label>

                        </div>
                        <div>
                            @using (Html.BeginForm("UsersList", "UserManager", FormMethod.Get)) // The html form of Searching function
                            {
                                <div class="text-right">
                                    <label>
                                        <input name="searchText" id="searchText" type="text" class="form-control input-medium input-inline"
                                               value="@ViewBag.CurrentFilter" placeholder="Tìm..">
                                        <button class="btn btn-default" type="submit">
                                            Tìm kiếm
                                        </button>
                                    </label>
                                </div>
                            }
                        </div>
                    </div>
                </div>
                @using (Html.BeginForm("ManageUsers", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, currentFilter = ViewBag.CurrentFilter }, FormMethod.Post))
                {
                    @Html.AntiForgeryToken()
                    <div id="sample_1_wrapper" class="dataTables_wrapper" role="grid">
                        <div class="row hidden-xs">
                            <div class="col-md-12 col-sm-12">
                                <!-- BEGIN Nút chức năng chọn số lượng cột hiển thị ở mỗi trang ======================================================================================-->
                                <div class="btn-group pull-left" style="margin-top: 7px; margin-right: 5px">
                                    <label>
                                        Hiển thị
                                    </label>
                                </div>
                                <div class="btn-group">
                                    <button id="sample_editable_1_new" class="btn btn-default dropdown-toggle" data-toggle="dropdown" style="display: inline">
                                        @if (rowsNumber == 0)
                                        {
                                            @: tất cả
                                        }
                                        else
                                        {
                                            @rowsNumber
                                        } <i class="fa fa-angle-down"></i>
                                    </button>
                                    <ul class="dropdown-menu pull-left">
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager")">
                                                10
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = 25, currentFilter = ViewBag.CurrentFilter })">
                                                25
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = 50, currentFilter = ViewBag.CurrentFilter })">
                                                50
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = "all", currentFilter = ViewBag.CurrentFilter })">
                                                tất cả
                                            </a>
                                        </li>
                                    </ul>
                                    <div class="btn-group" style="margin-top: 7px; margin-right: 20px; margin-left: 5px">
                                        <label>
                                            dòng.
                                        </label>
                                    </div>
                                </div>
                                <!-- END nút chức năng chọn số lượng cột hiển thị ở mỗi trang ======================================================================================-->
                                <!-- BEGIN Nút chọn các thao tác xoá khôi phục ======================================================================================-->
                                <div class="btn-group" style="margin-right: 20px">
                                    <button id="sample_editable_1_new" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                        Thao Tác <i class="fa fa-angle-down"></i>
                                    </button>
                                    <ul class="dropdown-menu pull-left">
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="Delete">
                                                Xoá
                                            </button>
                                        </li>
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="CancelDelete">
                                                Huỷ Lệnh Xoá
                                            </button>
                                        </li>
                                    </ul>
                                </div>
                                <!-- END Nút chọn các thao tác xoá khôi phục -->
                                <!-- BEGIN Nút phân quyền người dùng -->
                                <div class="btn-group">
                                    <button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                        Đổi Thành.. <i class="fa fa-angle-down"></i>
                                    </button>
                                    <ul class="dropdown-menu pull-left">
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="ChangeRole">
                                                Người dùng
                                            </button>
                                        </li>
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="ChangeRole">
                                                Quản Trị
                                            </button>
                                        </li>
                                    </ul>
                                </div>
                                <!-- END Nút phân quyền người dùng -->
                                <div class="btn-group pull-right hidden-sm hidden-xs">
                                    <label style="margin-top: 11px; font-style: italic;">
                                        Có @rowCount mục.
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="table-scrollable flip-scroll">
                            <table class="table table-striped table-hover dataTable flip-content" id="sample_1" aria-describedby="sample_1_info">
                                <!-- BEGIN HEADER của bảng -->
                                <thead class="flip-content">
                                    <tr role="row">
                                        <th class="table-checkbox sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="" style="width: 23px;">
                                            <div class="checker">
                                                <span>
                                                    <input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes">
                                                </span>
                                            </div>
                                        </th>
                                        <th  role="columnheader" rowspan="1" colspan="1" aria-label="Username: bấm vào để sắp xếp tăng dần A..Z" style="width: 188px;">
                                            <a style="padding-right: 20px" class="@PageNumberHelper.GetCssClassSorting("Username", ViewBag.CurrentSort, "Username")" href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.UsernameSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Tên Tài Khoản</a>
                                        </th>
                                        <th role="columnheader" rowspan="1" colspan="1" aria-label="Họ và Tên: bấm vào để sắp xếp tăng dần A..Z" style="width: 188px;">
                                            <a style="padding-right: 20px" class="@PageNumberHelper.GetCssClassSorting("Fullname", ViewBag.CurrentSort)" href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.FullnameSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Họ Tên</a>
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Email" style="width: 320px;">
                                            Email
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Vai trò trong hệ thống" style="width: 188px;">
                                            Vai Trò
                                        </th>
                                        <th role="columnheader" rowspan="1" colspan="1" aria-label="Ngày Tham Gia Hệ Thốnng" style="width: 169px;">
                                            <a style="padding-right: 20px" class="@PageNumberHelper.GetCssClassSorting("Date", ViewBag.CurrentSort)" href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.DateSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Ngày Tham Gia</a>
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Trạng thái hoạt động" style="width: 181px;">
                                            Trạng Thái
                                        </th>
                                    </tr>
                                </thead>
                                <!-- END HEADER của bảng -->
                                <!-- BEGIN TABLE BODY -->
                                <tbody role="alert" aria-live="polite" aria-relevant="all">
                                    @foreach (var userProfile in Model)
                                    {
                                        <tr class="gradeX odd">
                                            <!--== Checkbox để thực hiện chức na8nng xoá hoặc phân quyền ======================================================================================-->
                                            <td class="sorting_1">
                                                <div class="checker">
                                                    <span>
                                                        <input type="checkbox" class="checkboxes" value="@userProfile.UserId" name="checkboxes">
                                                    </span>
                                                </div>
                                            </td>
                                            <td class="hidden-btn-div">
                                                <a href="#" class="text-success"><strong>@userProfile.UserName</strong></a>
                                                <br />
                                                <div class="h-19 hidden-xs">
                                                    <a href="@Url.Action("EditUser", new { id = @userProfile.UserId })" class="hidden-btn">
                                                        Sửa
                                                    </a>
                                                    @if (!currentUsername.Equals(userProfile.UserName))
                                                    {
                                                    <text>
                                                        <small class="hidden-btn"> | </small>
                                                        <a href="#" class="hidden-btn text-danger">
                                                            Xoá
                                                        </a>
                                                    </text>
                                                    }
                                                </div>
                                            </td>
                                            <td class=" ">
                                                @userProfile.FullName
                                            </td>
                                            <td class=" ">
                                                <a href="mailto:@userProfile.Email">@userProfile.Email</a>
                                            </td>
                                            <td class="center ">
                                                @if (userProfile.Roles.Contains(roleComparator.RoleAdmin, roleComparator))
                                                {
                                                    @: Quản Trị
                                                }
                                                else if (userProfile.Roles.Contains(roleComparator.RoleAgency, roleComparator))
                                                {
                                                    @: Quản Lý Công Ty
                                                }
                                                else
                                                {
                                                    @: Du Khách
                                                }
                                            </td>
                                            <td class=" ">
                                                @userProfile.CreatedDate.ToString("dd/MM/yyyy")
                                            </td>
                                            <td class=" ">
                                                @if (!userProfile.IsDeleted)
                                                {
                                                    <span class="label label-sm label-success">
                                                        Hoạt động
                                                    </span>
                                                }
                                                else
                                                {
                                                    <span class="label label-sm label-danger">
                                                        Chờ xoá
                                                    </span><br />
                                                    <small>Từ: @userProfile.LastModified.ToString("dd/MM/yyyy")</small>
                                                }
                                            </td>
                                        </tr>
                                    }
                                </tbody>
                                <!-- END TABLE BODY -->
                                <!-- BEGIN TABLE FOOTER -->
                                <tfoot class="">
                                    <tr class="hidden-sm hidden-xs" role="row">
                                        <th class="table-checkbox sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="" style="width: 23px;">
                                            <div class="checker">
                                                <span>
                                                    <input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes">
                                                </span>
                                            </div>
                                        </th>
                                        <th class="sorting" role="columnheader" rowspan="1" colspan="1" aria-label="Username: bấm vào để sắp xếp tăng dần A..Z" style="width: 188px;">
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.UsernameSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Tên Tài Khoản</a>
                                        </th>
                                        <th class="sorting" role="columnheader" rowspan="1" colspan="1" aria-label="Họ và Tên: bấm vào để sắp xếp tăng dần A..Z" style="width: 188px;">
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.FullnameSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Họ Tên</a>
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Email" style="width: 320px;">
                                            Email
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Vai trò trong hệ thống" style="width: 320px;">
                                            Vai Trò
                                        </th>
                                        <th class="sorting" role="columnheader" rowspan="1" colspan="1" aria-label="Ngày Tham Gia Hệ Thốnng" style="width: 169px;">
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = pageNumber, rowsPerPage = rowsNumber, sortOrder = ViewBag.DateSortParm, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole })">Ngày Tham Gia</a>
                                        </th>
                                        <th class="sorting_disabled" role="columnheader" rowspan="1" colspan="1" aria-label="Trạng thái hoạt động" style="width: 181px;">
                                            Trạng Thái
                                        </th>
                                    </tr>
                                </tfoot>
                            </table>
                            <!-- END TABLE FOOTER -->
                        </div>
                        <div class="row">
                            <div class="col-md-7 col-sm-12 mt-10">
                                <div class="btn-group pull-left" style="margin-top: 7px; margin-right: 5px">
                                    <label>
                                        Hiển thị
                                    </label>
                                </div>
                                <div class="btn-group">
                                    <button id="sample_editable_1_new" class="btn btn-default dropdown-toggle" data-toggle="dropdown" style="display: inline">
                                        @if (rowsNumber == 0)
                                        {
                                            @: tất cả
                                        }
                                        else
                                        {
                                            @rowsNumber
                                        } <i class="fa fa-angle-down"></i>
                                    </button>
                                    <ul class="dropdown-menu pull-left">
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager")">
                                                10
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = 25, currentFilter = ViewBag.CurrentFilter })">
                                                25
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = 50, currentFilter = ViewBag.CurrentFilter })">
                                                50
                                            </a>
                                        </li>
                                        <li>
                                            <a href="@Url.Action("UsersList", "UserManager", new { page = 1, rowsPerPage = "all", currentFilter = ViewBag.CurrentFilter })">
                                                tất cả
                                            </a>
                                        </li>
                                    </ul>
                                    <div class="btn-group" style="margin-top: 7px; margin-right: 20px; margin-left: 5px">
                                        <label>
                                            dòng.
                                        </label>
                                    </div>
                                </div>
                                <!-- END nút chức năng chọn số lượng cột hiển thị ở mỗi trang ======================================================================================-->
                                <!-- BEGIN Nút chọn các thao tác xoá khôi phục ======================================================================================-->
                                <div class="btn-group" style="margin-right: 20px">
                                    <button id="sample_editable_1_new" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                        Thao Tác <i class="fa fa-angle-down"></i>
                                    </button>
                                    <ul class="dropdown-menu pull-left">
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="Delete">
                                                Xoá
                                            </button>
                                        </li>
                                        <li>
                                            <button class="btn btn-link" type="submit" name="action" value="CancelDelete">
                                                Huỷ Lệnh Xoá
                                            </button>
                                        </li>
                                    </ul>
                                </div>
                                <!-- END Nút chọn các thao tác xoá khôi phục -->
                            </div>
                            <!-- BEGIN PAGINATION -->
                            <div class="col-md-5 col-sm-12">
                                <div class="dataTables_paginate paging_bootstrap">
                                    @Html.PagedListPager(Model, page => Url.Action("UsersList", "UserManager",
                                        new { page, rowsPerPage = rowsNumber, sortOrder = ViewBag.CurrentSort, currentFilter = ViewBag.CurrentFilter, role = ViewBag.CurrentRole }))
                                </div>
                            </div>
                            <!-- END PAGINATION -->
                        </div>
                        <div class="row">
                            <div class="col-md-5 col-sm-12">
                                <div class="dataTables_info" id="sample_1_info">Đang hiển thị các item từ @((pageNumber - 1) * rowsNumber + 1) đến @((pageNumber - 1) * rowsNumber + rowCount) của @ViewData["usersCount"] danh mục tài khoản</div>
                            </div>
                        </div>
                    </div>
                }
            </div>
        </div>
        <!-- END TABLE PORTLET-->
    </div>
</div>

@section scripts {
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <script type="text/javascript" src="~/Content/metronic/plugins/select2/select2.min.js"></script>
    <script type="text/javascript" src="~/Content/metronic/plugins/data-tables/jquery.dataTables.js"></script>
    <script src="~/Content/metronic/scripts/core/datatable.js"></script>
    @*<script type="text/javascript" src="~/Content/metronic/plugins/data-tables/DT_bootstrap.js"></script>*@
    <!-- END PAGE LEVEL PLUGINS -->
    <!-- BEGIN PAGE LEVEL SCRIPTS -->
    <script src="~/Content/metronic/scripts/custom/table-managed.js"></script>
    <script>
        jQuery(document).ready(function () {
            //Handle the Group-Checkbox button
            jQuery('#sample_1 .group-checkable').change(function () {
                var set = jQuery(this).attr("data-set");
                var checked = jQuery(this).is(":checked");
                jQuery(set).each(function () {
                    if (checked) {
                        $(this).attr("checked", true);
                        $(this).parents('tr').addClass("active");
                        $(this).parents('span').addClass("checked");
                    } else {
                        $(this).attr("checked", false);
                        $(this).parents('tr').removeClass("active");
                        $(this).parents('span').removeClass("checked");
                    }
                });
                jQuery.uniform.update(set);
                $('#sample_1 .group-checkable').parents('span').toggleClass("checked");
            });

            // Handle checkbox button for every Checkbox respectively
            jQuery('#sample_1').on('change', 'tbody tr .checkboxes', function () {
                var checked = jQuery(this).is(":checked");
                if (checked) {
                    $(this).attr("checked", true);
                } else {
                    $(this).attr("checked", false);
                }
                $(this).parents('tr').toggleClass("active");
                $(this).parents('span').toggleClass("checked");
            });
        });
    </script>
}